<template>
  <el-dialog class="gl_dialog_TitleLine" :title="$t('messageCenter.detail')" :visible.sync="isDetail" :before-close="close" :close-on-click-modal="false" width="880px">
    <div v-loading="loading">
      <el-row class="gl_mb_15">
        <el-col :span="16" :offset="4" class="title">{{ rowData.message.title }}</el-col>
        <el-col :span="4">{{ rowData.message.messageDate | FormatDate('yyyy-MM-dd HH:mm:ss') }}</el-col>
      </el-row>
      <!-- <el-row class="gl_py_10">发送人：{{ rowData.sendUserName }}</el-row> -->
      <el-row>
        <el-col class="message" :span="22" v-html="rowData.message.message" />
      </el-row>
    </div>
    <span slot="footer">
      <el-button type="primary" size="mini" @click="close">{{ $t('button.close') }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  name: 'Message',
  props: {
    isDetail: { // 控制弹出框的显示
      type: Boolean,
      default: false
    },
    rowData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      loading: false
      // isShowDetail: this.isDetail
    };
  },
  methods: {
    close() {
      this.$emit('showDetail', false);
      this.$parent.refreshList();
    }
  }
};
</script>

<style scoped>
.title {
  font-size: 24px;
  text-align: center;
}
.message {
  overflow: hidden;
}
.message /deep/ img {
  max-width: 750px;
  max-height: 900px;
}
</style>
